<template>
  <section class="component case-excel-import-new">

    <el-form ref="form" :model="importModel" label-width="150px" :rules="rules">
      <el-form-item label="上传文件">
        <file-upload ref="upload_case_import" :fileList.sync="fileList" :fileNumberLimit="1" :AllowExtension="['xlsx']">
        </file-upload>
      </el-form-item>
      <el-button type="primary" plain v-if="fileList.length !== 0" style="margin: 10px 0 0 150px" @click="lookBtn()">浏览</el-button>
    </el-form>
    <div class="operate-buttons">
      <el-button @click="close">取消</el-button>
      <el-button @click="submit">确定</el-button>
    </div>

    <!-- 导入详情 -->
    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false" :visible.sync="dialog.exportDetail" title="导入详情" append-to-body>
      <export-detail @close="dialog.exportDetail = false" ref="export-detail" :submitType="submitType" />
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import { Dependencies } from "~/core/decorator";
import { State, Getter, Action, namespace } from "vuex-class";
import { Emit, Component, Prop, Watch } from "vue-property-decorator";
import FileUpload from "~/components/common/file-upload.vue";
import { CustomFollowService } from "~/services/domain-service/custom-follow.service";
import { PageService } from "~/utils/page.service";
import { ListRemovedService } from "~/services/domain-service/list-removed.service";
import { customImportMenuType } from "~/config/enum.config";
import ExportDetail from "./export-detail.vue";

@Component({
  name: "case-excel-import",
  components: {
    FileUpload,
    ExportDetail,
  },
})
export default class CaseExcelImportNew extends Vue {
  @State private principalList: any;
  @Dependencies(CustomFollowService)
  private customFollowService: CustomFollowService;
  @Dependencies(ListRemovedService)
  private listRemovedService: ListRemovedService;
  @Prop() private submitType;
  private importModel: any = {};
  private rules: any = {};
  private fileList: any = [];
  private dialog: any = {
    exportDetail: false,
  };
  @Emit("close") private close() {
    const upload: any = this.$refs["upload_case_import"];
    upload.reset();
    const dataform: any = this.$refs["form"];
    dataform.resetFields();
  }

  // @Watch('submitType', { immediate: true })
  // private change () {
  //   console.log(this.submitType)
  // }

  //获取案件列表
  private refreshData() {
    // this.customFollowService
    //   .findAllByPage(this.model, this.pageService)
    //   .subscribe(data => {
    //     this.dataSet = data.content;
    //   });
  }

  private submit() {
    if (this.fileList.length === 0) {
      this.$message("请上传导入文件");
      return;
    }
    // 存储文件ID
    const fileId = this.fileList[0].response.id;
    const dataForm: any = this.$refs["form"];
    dataForm.validate((valid) => {
      if (!valid) return;
    });
    if (this.submitType === customImportMenuType.Enrollment)
      this.accountSubmit(fileId);
    if (this.submitType === customImportMenuType.OutReminder)
      this.coustomerSubmit(fileId);
    // if (this.submitType === customImportMenuType.listRemoved) this.listRem(fileId);
  }

  private listRem(fileId) {
    this.listRemovedService
      .importEliminate({ id: fileId })
      .subscribe((data) => {
        // this.emitSuccess();
      });
  }
  private accountSubmit(fileId) {
    this.customFollowService
      .importFollowInTemplate({ id: fileId })
      .subscribe((data) => {
        this.$emit('close', close)
        if (data.isSuccess === "ERROR") {
          this.$message("上传模板有误");
          this.fileList = []
          return;
        }
        this.dialog.exportDetail = true;
        // 监听返回的列表数据
        this.$nextTick(() => {
          const ExportDetail: any = this.$refs["export-detail"];
          ExportDetail.update(data);
        });
        this.fileList = []
      });
  }

  // 浏览
  private lookBtn() {
    this.$common.downloadFile(this.fileList[0].response.url);
  }

  private coustomerSubmit(fileId) {
    this.customFollowService
      .importFollowOutTemplate({ id: fileId })
      .subscribe((data) => {
        // if (data.isSuccess !== "YES") this.$common.downloadFile(data.url);
        this.dialog.exportDetail = true;
        this.$emit('close', close)
        // 监听返回的列表数据
        this.$nextTick(() => {
          const ExportDetail: any = this.$refs["export-detail"];
          ExportDetail.update(data);
        });
        this.fileList = []
      });
  }
}
</script>
